<template>
  <el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible"
             @close="clearDataList()" width="90vw" top="5vh" append-to-body>
    <el-container>
      <el-main style="height:70vh;overflow-x: hidden;">
        <el-row :gutter="20">
          <el-col :xs="24" :sm="24" :md="5">
            <div class="boxsty">
              <el-tree :data="treeData" :props="defaultProps" :filter-node-method="filterNode" class="filter-tree"
                       node-key="id" highlight-current :default-expanded-keys="[1]" accordion @node-click="getNodeData" />
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="19">
            <div class="boxsty">
              <div class="tabletext titbottom">已选择部门</div>
              <el-table :data="tableDataDept" stripe>
                <el-table-column prop="deptName" label="部门名称" min-width="350">
                </el-table-column>
                <el-table-column  label="操作" width="100">
                  <template slot-scope="scope">
                    <el-button @click="handleClick(scope.$index)" type="danger" plain>删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-col>
        </el-row>
      </el-main>
    </el-container>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" v-if="canSubmit" @click="btnSave">确定</el-button>
      <el-button type="primary" plain @click="btnCancel">取消</el-button>
      
    </span>
  </el-dialog>
</template>

<script>
import { selHzBmList, savelist, removeByHzId } from '@/api/ceping/cepinghzgldxpzb'
import { fetchTree, getObj} from '@/api/admin/dept'

export default {
  data() {
    return {
      qjGzId: "",
      visible: false,
      canSubmit: false,
      tableDataDept: [],
      dataForm: {

      },
      listQuery: {
        name: undefined
      },
      treeData: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      },

    }
  },
  created() {
    this.getList();
  },
  methods: {
    init(id) {
      this.dataForm.id = id || 0;
      this.qjGzId = id;
      this.visible = true;
      this.canSubmit = true;
      this.loadTableDataUser(id);
    },
    //查询被测评对象
    loadTableDataUser(id) {
      selHzBmList(id).then(data => {
        var obj = data.data.data;
        if (obj) {
          for (var i = 0; i < obj.length; i++) {
            this.tableDataDept.push({
              id: obj[i].id,
              hzId: obj[i].hzId,
              // userId: obj[i].userId,
              // userName: obj[i].userName,
              deptId: obj[i].deptId,
              deptName: obj[i].deptName,
              // userZw: obj[i].userZw,
              // userLx: obj[i].userLx,
              // userDeptId: obj[i].userDeptId,
              // userDeptName: obj[i].userDeptName,
              bhzPx: obj[i].bhzPx,
            });
          }
        }
      }).catch(() => {
        this.$notify.error('数据错误')
      });
    },
    getList() {
      fetchTree(this.listQuery).then(response => {
        ////console.log(response.data);
        this.treeData = response.data.data
      })
    },
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    getNodeData(data) {
      ////console.log(data);
      getObj(data.id)
        .then(res => {
          const deptDetail = res.data.data;
          let bFind = false;
          this.tableDataDept.find(value => {
            if (data.id === value.deptId) {
              bFind = true;
            }
          })
          if (bFind) {
            return;
          }
          this.tableDataDept.push({
            hzId: this.qjGzId,
            deptId: data.id,
            deptName: data.name,
            // deptExplain: deptDetail.deptName
          })
        })
        .catch(err => {
         //console.log(err);
        })
    },
    handleClick(index) {
      ////console.log(index);
      this.tableDataDept.splice(index, 1);
    },
    //清空记录
    clearDataList() {
      this.tableDataDept = [];
      this.qjGzId = '';
    },
    //保存部门
    btnSave() {
      this.canSubmit=false;
      if(this.tableDataDept.length==0){
        removeByHzId(this.qjGzId).then(res=>{
          this.$notify.success('清除成功')
          this.visible = false
          this.$emit('showRemarkList')
        }).catch(() =>{
          this.canSubmit = true;
        })
      }else {
        ////console.log(this.tableDataDept);
        savelist(this.tableDataDept).then(data => {
          this.$notify.success('添加成功')
          this.visible = false
          this.$emit('showRemarkList')
        }).catch(() => {
          this.canSubmit = true;
        });
      }
    },
    //取消按钮
    btnCancel() {
      this.visible = false;
      this.clearDataList();
    }
  }
}

</script>

<style scoped>
</style>
